//キャンバス要素のコンテキスト
var ctx = null;
//タイマー(50ミリ毎秒)
var timer = null;

var p = 0.0;
var q_prev = (3/4)*Math.PI;
var q = q_prev + p;

var h=0.01;

function main() {
  //画面クリア
  ctx.clearRect(0,0,256,256);
  //Verlet法
  var q_temp = q;
  q += q - q_prev - Math.sin(q) * h;
  q_prev = q_temp;

  p = q - q_prev;

  //描画
  ctx.rect(q*32+128,-p*128+128,4,4);
  ctx.fill();

  $('msg').innerHTML = ['q=',q,'p=',p].join(' ');
}

function init() {
  var canvas = document.getElementById("canvas");
  if (!canvas.getContext) return;
  ctx = canvas.getContext('2d');
  $('msg').innerHTML = '';
  if (timer) timer.stop();
  timer = new PeriodicalExecuter(main,0.05);  
}

window.onload = init;
